<template>
  <div class="DoctorTypeMa">
    <div class="pubBig medical">
      <div class="h0">
        <p class="lt"></p>
      </div>
      <div class="topLine">
        <ul class="mUL">
          <li class="high">医生号种对应表</li>
          <li>医生诊查费对应表</li>
        </ul>
        <p>
          <button class="btn btn-default">查询</button>
        </p>
      </div>
      <div class="mContent">
        <div>
          <p class="p0">
            <button class="btn-success btn">对照</button>
            <button class="btn-danger btn">撤销</button>
          </p>
          <div class="ltList">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th>号种</th>
                  <th>挂号费</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>主治医师</td>
                  <td>10</td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="rtList">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th>医生</th>
                  <th>号种</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>张三</td>
                  <td>普通医生</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
        <div style="display:none">
          <p class="p0">
            <button class="btn-success btn">对照</button>
            <button class="btn-danger btn">撤销</button>
          </p>
          <div class="ltList">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th>编号</th>
                  <th>诊查费</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>0000001</td>
                  <td>普通门诊诊查费</td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="rtList">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th>医生</th>
                  <th>诊查费</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>张三</td>
                  <td>100.00</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<style lang="scss">
.DoctorTypeMa {
  .medical .topLine {
    padding: 0 15px 0 0;
  }
  .medical .topLine p {
    float: right;
    margin-top: 7px;
  }
  .medical .topLine p .btn {
    margin-left: 8px;
  }
  .medical .mUL {
    height: 35px;
    line-height: 35px;
    margin: 10px 0 0 15px;
    float: left;
  }
  .medical .mUL li {
    float: left;
    padding: 0 15px;
    background: #f9f9f9;
    cursor: pointer;
  }
  .medical .mUL li.high {
    background: #e3f0fd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #1d6cc3;
    border-top: 1px solid #bfdcff;
    border-left: 1px solid #bfdcff;
    border-right: 1px solid #bfdcff;
  }
  .medical .mUL li:first-child {
    border-top-left-radius: 3px;
  }
  .medical .mUL li:last-child {
    border-top-right-radius: 3px;
  }
  .medical .mContent {
    clear: both;
  }
  /*.medical .mContent .p0{background: url(./images/line0.png) repeat-x; background-size: contain;*/
  /*padding: 10px 15px;}*/
  .medical .mContent .p0 .btn {
    margin-right: 8px;
  }
  .medical .mContent .ltList {
    border-right: 1px solid #ddd;
    width: 380px;
    padding: 8px 10px;
    position: absolute;
    top: 142px;
    left: 0;
    bottom: 0;
    overflow-y: auto;
  }
  .medical .mContent .rtList {
    padding: 8px 10px;
    position: absolute;
    top: 143px;
    left: 380px;
    bottom: 0;
    overflow-y: auto;
    right: 0;
  }
  .medical .mContent .rtList .table {
    width: 600px;
  }
}
</style>
